<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>17商城</title>
    <link type="text/css" href="css/css.css" rel="stylesheet"/>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/js.js"></script>
    <script src="js/wb.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>
<div class="mianCont">
    <div class="top">
        <span>您好！欢迎来到17商城 请&nbsp;<a href="login.jsp">[登录]</a>&nbsp;<a href="reg.jsp">[注册]</a></span>
        <span class="topRight">
    <a href="vip.jsp">我的17</a>&nbsp;|
    <a href="order.jsp">我的订单</a>&nbsp;|
    <a href="login.jsp">会员中心</a>&nbsp;|
    <a href="contact.jsp">联系我们</a>
   </span>
    </div><!--top/-->
    <div class="lsg">
        <h1 class="logo"><a href="index.jsp"><img src="images/logo.png" width="217" height="90"/></a></h1>
        <form action="#" method="get" class="subBox">
            <div class="subBoxDiv">
                <input type="text" class="subLeft"/>
                <input type="image" src="images/subimg.png" width="63" height="34" class="sub"/>
                <div class="hotWord">


                </div><!--hotWord/-->
            </div><!--subBoxDiv/-->
        </form><!--subBox/-->
        <div class="gouwuche">
            <div class="gouCar">
                <img src="images/gouimg.png" width="19" height="20" style="position:relative;top:6px;"/>&nbsp;|&nbsp;
                <strong class="red">0</strong>&nbsp;件&nbsp;|
                <strong class="red">￥ 0.00</strong>
                <a href="order.jsp">去结算</a> <img src="images/youjian.jpg" width="5" height="8"/>
            </div><!--gouCar/-->
            <div class="myChunlv">
                <a href="vip.jsp"><img src="images/mychunlv.jpg" width="112" height="34"/></a>
            </div><!--myChunlv/-->
        </div><!--gouwuche/-->
    </div><!--lsg/-->
    <div class="pnt">
        <div class="pntLeft">
            <h2 class="Title">所有商品分类
                <ul class="InPorNav">
                    <li><a href="product.jsp">纸杯系列</a>
                        <div class="chilInPorNav">
                            <a href="#">单层热饮杯</a>
                            <a href="#">双层中空杯</a>
                            <a href="#">瓦楞隔热杯</a>
                            <a href="#">双淋膜冷饮杯</a>
                            <a href="#">爆米花桶</a>
                            <a href="#">纸碗</a>
                            <a href="#">冰淇淋纸杯</a>
                            <a href="#">PS杯盖</a>
                        </div><!--chilLeftNav/-->
                    </li>
                    <li><a href="product.jsp">PET系列</a>
                        <div class="chilInPorNav">
                            <a href="#">PET透明杯</a>
                            <a href="#">PET透明盖</a>
                            <a href="#">PET透明沙拉盒</a>
                        </div><!--chilLeftNav/-->
                    </li>
                    <li><a href="product.jsp">饮品杯配套系列</a>
                        <div class="chilInPorNav">
                            <a href="#">杯袖</a>
                            <a href="#">环保纸浆杯托</a>
                            <a href="#">纸杯打包袋</a>
                            <a href="#">吸管</a>
                            <a href="#">搅拌棒</a>
                            <a href="#">杯盖</a>
                        </div><!--chilLeftNav/-->
                    </li>
                    <li><a href="product.jsp">纸浆环保餐具系列</a>
                        <div class="chilInPorNav">
                            <a href="#">纸碟</a>
                            <a href="#">纸碗</a>
                            <a href="#">纸浆带盖汤碗</a>
                            <a href="#">连体餐盒</a>
                            <a href="#">分体餐盒</a>
                            <a href="#">纸浆沙拉盒</a>
                            <a href="#">纸托盘</a>
                        </div><!--chilLeftNav/-->
                    </li>
                    <li><a href="product.jsp">纸餐盒系列</a>
                        <div class="chilInPorNav">
                            <a href="#">圆底纸餐盒</a>
                            <a href="#">方底纸餐盒</a>
                            <a href="#">三明治纸盒</a>
                            <a href="#">蛋糕盒</a>
                            <a href="#">其他纸餐盒</a>
                        </div><!--chilLeftNav/-->
                    </li>
                    <li><a href="product.jsp">刀叉勺餐具</a>
                        <div class="chilInPorNav">
                            <a href="#">PS刀叉勺系列</a>
                            <a href="#">PLA刀叉勺系列</a>
                            <a href="#">淀粉刀叉勺系列</a>
                            <a href="#">搅拌棒/吸管</a>
                        </div><!--chilLeftNav/-->
                    </li>
                    <li><a href="product.jsp">生活用纸</a>
                        <div class="chilInPorNav">
                            <a href="#">餐巾纸</a>
                            <a href="#">抽纸</a>
                            <a href="#">卫生纸</a>
                            <a href="#">擦手纸</a>
                            <a href="#">其他纸类</a>
                        </div><!--chilLeftNav/-->
                    </li>
                    <li><a href="product.jsp">纸袋/环保打包袋</a>
                        <div class="chilInPorNav">
                            <a href="#">纸袋</a>
                            <a href="#">环保淀粉塑料袋</a>
                            <a href="#">PLA塑料袋</a>
                            <a href="#">食品袋</a>
                        </div><!--chilLeftNav/-->
                    </li>
                </ul><!--InPorNav/-->
            </h2>
        </div><!--pntLeft/-->
        <div class="pntRight">
            <ul class="nav">
                <li><a href="index.jsp">商城首页</a></li>
                <li><a href="product.jsp">促销中心</a></li>
                <li><a href="login.jsp">会员中心</a></li>
                <li class="navCur"><a href="help.jsp">帮助中心</a></li>
                <div class="clears"></div>
                <div class="phone">TEL：021-12345678</div>
            </ul><!--nav/-->
        </div><!--pntRight/-->
        <div class="clears"></div>
    </div><!--pnt/-->
    <div class="positions">
        当前位置：<a href="index.jsp">首页</a> &gt; <a href="#" class="posCur">购物车</a>
    </div><!--positions/-->
    <div class="cont">
        <div class="carImg"><img src="images/car1.jpg" width="951" height="27"/></div>
        <table class="orderList">
            <tr>
                <th width="60"><input type="checkbox" id="ck_all"/>全选</th>
                <script type="text/javascript">
                    $(function () {
                        $("#ck_all").click(function () {
                            $(".pids").each(function () {
                                $(this).prop("checked", $("#ck_all").prop("checked"));
                            })
                            sumtotal();
                        })
                    })
                    $(function () {
                        $(".pids").click(function () {
                            if (!$(this).prop("checked")) {
                                $("#ck_all").prop("checked", false)
                            }
                            sumtotal();
                        })
                    })
                </script>
                <th width="430">商品</th>
                <th width="135">单价</th>
                <th width="135">数量</th>
                <th width="135">总金额</th>
                <th>操作</th>
            </tr>
            <c:forEach items="${carts}" var="cart">
            <tr>
                <td><input type="checkbox" class="pids" name="pids" value="${cart.value.gid}"></td>
                <td>
                    <dl>
                        <dt><a href="proinfo.jsp"><img src="${pageContext.request.contextPath}/gimages/${cart.value.g_img}" width="85" height="85"/></a></dt>
                        <dd>${cart.value.gname}<br/></dd>
                        <div class="clears"></div>
                    </dl>
                </td>
                <td>￥<strong class="red" id="price${cart.value.gid}">${cart.value.price}</strong></td>
                <td>
                    <div class="jia_jian">
                            <%--      <img src="images/jian.jpg" width="21" height="25" class="jian" />--%>
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                        <strong id="input${cart.value.gid}" class="red">${cart.value.num}</strong>
                <td>￥<strong class="red" id="nums${cart.value.gid}">${cart.value.price * cart.value.num}</strong></td>
                <script type="text/javascript">
                    $(function () {
                        $("#input" +${cart.value.gid}).blur(
                            function () {
                                var num = $(this).val();
                                //  判断获得numb是不是数。
                                var price = $("#price" +${cart.value.gid}).text();
                                alert(num * parseFloat(price))
                                $("#nums" +${cart.value.gid}).text(num * parseFloat(price));
                                sumtotal()

                            }
                        )
                    })
                </script>
                    <%--      <img src="images/jia.jpg" width="21" height="25" class="jia" />--%>
    </div>
    </td>

    <td><a href="#" class="green">删除</a></td>
    </tr>
    </c:forEach>
    <%--============================================================================================================================--%>
    <tr>
        <td colspan="6">
            <div class="shanchu"><img src="images/lajio.jpg"/> 全部删除</div>
        </td>
    </tr>
    </table><!--orderList/-->

    <div class="zongji">
        总计(不含运费)：￥<strong class="red" id="sum">0</strong>
    </div><!--zongji/-->
    <script type="text/javascript">
        function sumtotal() {
            var total = 0.0;
            $(".pids:checked").each(
                function () {
                    var gid = $(this).val()
                    var sum = $("#nums" + gid).text();
                    total += parseFloat(sum);
                }
            );
            $("#sum").text(total);
        }
    </script>
    <div class="jiesuan">

        <input type="button" id="order_but" value="立即结算" class="jie_2"/>
        <script type="text/javascript">
            $(function () {
                $("#order_but").click(
                    function () {
                        numb = $(".pids:checked").length
                        if (numb == 0) {
                            alert("选择你要购买的物品！")
                        } else {
                            var pids = new Array()
                            var sprice = new Array()
                            var gnum = new Array()
                            $(".pids:checked").each(function () {
                                pids.push($(this).val())
                                sprice.push($("#nums" + $(this).val()).text())
                                gnum.push($("#input"+$(this).val()).text())
                            })

                            location.href="${pageContext.request.contextPath}/addOrder?pids="+pids+"&sprice="+sprice + "&gnum="+gnum;
                        }

                    }
                )
            })

        </script>
        <div class="clears"></div>
    </div><!--jiesuan/-->
    <div class="clears"></div>
</div><!--cont/-->
<div class="inHelp">
    <div class="inHLeft">
        <h4>帮助中心</h4>
        <ul class="inHeList">
            <li><a href="help.jsp">购物指南</a></li>
            <li><a href="help.jsp">支付方式</a></li>
            <li><a href="help.jsp">售后服务</a></li>
            <li><a href="about.jsp">企业简介</a></li>
            <div class="clears"></div>
        </ul><!--inHeList/-->
    </div><!--inHLeft/-->
    <div class="inHLeft">
        <h4>会员服务</h4>
        <ul class="inHeList">
            <li><a href="reg.jsp">会员注册</a></li>
            <li><a href="login.jsp">会员登录</a></li>
            <li><a href="order.jsp">购物车</a></li>
            <li><a href="order.jsp">我的订单</a></li>
            <div class="clears"></div>
        </ul><!--inHeList/-->
    </div><!--inHLeft/-->
    <div class="inHRight">
        <h4>全国统一免费服务热线</h4>
        <div class="telBox">400-0000-0000</div>
        <div class="weibo">
            <wb:follow-button uid="2991975565" type="red_1" width="67" height="24"></wb:follow-button>
        </div>
    </div><!--inHRight/-->
    <div class="clears"></div>
</div><!--inHelp/-->
<div class="footer">
    <p>
        <a href="#">进入17官网</a>&nbsp;|&nbsp;
        <a href="index.jsp">商城首页</a>&nbsp;|&nbsp;
        <a href="product.jsp">促销中心</a>&nbsp;|&nbsp;
        <a href="order.jsp">我的订单</a>&nbsp;|&nbsp;
        <a href="new.html">新闻动态</a>&nbsp;|&nbsp;
        <a href="login.jsp">会员中心</a>&nbsp;|&nbsp;
        <a href="help.htmll">帮助中心</a>
    </p>
    <p>
        版权所有：上海17实业有限公司 版权所有 Copyright 2010-2015 沪ICP备00000000号 <a href="http://www.cssmoban.com/"
                                                                   target="_blank">模板之家</a>
    </p>
</div><!--footer/-->
</div><!--mianCont/-->
<a href="#" class="backTop">&nbsp;</a>


</body>
</html>
